<template>
    <div>
        <div class="background">
            <image src="../../static/images/lottery/pointer.png" @click="start" class="pointer"/>
            <image src="../../static/images/lottery/turntable.png" :animation="rotateData" class="turntable"/>
        </div>
    </div>
</template>
<script>
let animation = wx.createAnimation({
  duration: 4000,
  timingFunction: 'ease-in-out',
});
export default {
    data(){
        return {
            rotateData:{},
            turning: false, //是否正在转动
        }
    },
    methods:{
        start(){
            wx.showToast({
                title: "活动尚未开放", //提示的内容,
                icon: "success", //图标,
                duration: 2000, //延迟时间,
                mask: true, //显示透明蒙层，防止触摸穿透,
                success: res => {
                    // wx.navigateBack({
                    //   delta: 1 //返回的页面数，如果 delta 大于现有页面数，则返回到首页,
                    // });
                }
            });
            // let _this = this;
            // if (!this.turning) {
            //     let cat = 51.4; //7个区域，每个区域51.4度
            //     let rdm = 0; //随机旋转度数
            //     let num = 0; //结束后停留的度数

            //     rdm = Math.floor(Math.random() * 3600*5);

            //     animation.rotate(rdm).step();
            //     //this.setData({ rotateData: animation.export(), turning: true });
            //     this.rotateData = animation.export();
            //     this.turning = true;
            //     setTimeout(() => {
            //         //_this.setData({ turning: false });
            //         this.turning = false;
            //         num = rdm % 360;
            //         let msg = '';
            //         if (num <= cat * 1) {
            //             msg = '恭喜您，你抽到了4999消费券';
            //         } else if (num <= cat * 2) {
            //             msg = '恭喜您，你抽到了50元代金券';
            //         } else if (num <= cat * 3) {
            //             msg = '恭喜您，你抽到了10元代金券';
            //         } else if (num <= cat * 4) {
            //             msg = '恭喜您，你抽到了5元代金券';
            //         } else if (num <= cat * 5) {
            //          msg = '恭喜您，你抽到了免息服务费';
            //         } else if (num <= cat * 6) {
            //          msg = '恭喜您，你抽到了提高白条额度';
            //         } else if (num <= cat * 7) {
            //              msg = '很遗憾，您未中奖'
                        
            //         }
            //         this.showModal(msg);
            //     }, 4200);
            // }
        },
        showModal(str) {
            var that = this;
            wx.showModal({
                title: '提示',
                content: str,
                success: function() {
                    //let ctx = getCurrentPages()[getCurrentPages().length - 1];
                    let animation = wx.createAnimation({
                        duration: 500,
                        timingFunction: 'ease-in-out',
                    });
                    animation.rotate(0).step();
                    //ctx.setData({ rotateData: animation.export() });
                    that.rotateData = animation.export();
                },
            });
        }
    }
}
</script>

<style lang="scss" scoped>
.background {
  background: url('')
    no-repeat;
  width: 325px;
  height: 300px;
  margin: 0 auto;
  position: relative;
  background-size: 100% 100%;

  .pointer {
        width: 87px;
        height: 114px;
        position: absolute;
        z-index: 10;
        left: 124px;
        top: 82px;
    }
    .turntable {
        width: 225px;
        height: 225px;
        position: absolute;
        z-index: 5;
        left: 58px;
        top: 30px;
    }
}


</style>


